.Toggle {
    display: flex;
    align-items: center;
    justify-content: center;

    .Switch {
        position: relative;
        display: inline-block;
        width: 55px;
        height: 30px;
    }

    .Switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

    .Slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: var(--grey-button-hover);
        transition: 0.4s;
        border-radius: 30px;
    }

    .Slider::before {
        position: absolute;
        content: "";
        height: 26px;
        width: 26px;
        left: 2px;
        bottom: 2px;
        background-color: var(--bg-color);
        transition: 0.4s;
        border-radius: 50%;
    }

    input:checked + .Slider {
        background-color: var(--green-button-hover);
    }

    input:checked + .Slider::before {
        transform: translateX(25px);
    }
}
